<template>
  <div>
    <FilterTable
      ref="table"
      height="auto"
      :columns="columns"
      :dataSource="cluesList"
      :isPagination='false'
      :isToperInfo='false'
      :isColumnFilter='false'
      :isSelectColumn='false'
      selectionType="single"
      :onColumnsChange="columns => this.columns = columns"
    ></FilterTable>
  </div>
</template>

<script>
import { queryAboutClues } from '@/api/potenCus/customer/potenCusManage';
import { dictionary } from '@/utils/dictMixin';
import { formatDates } from '@/utils/validate';

export default {
  name: 'aboutClues',
  mixins: [dictionary],
  props: {
    type: {
      type: String,
      default: 'show'
    },
    rowData: {
      type: Object,
      default: () => ({})
    }
  },
  data() {
    this.saveData = null;
    return {
      cluesList: [],
      columns: this.createTableColumns(),
      handleType: '',
      formData: {},
    };
  },
  created() {
    this.init();
    this.getAboutCluesList()
  },
  methods: {
    init() {
        console.log('相关', this.rowData)
        // 更新接口需要的记录 ID
        this.mobilePhone = this.rowData.mobilePhone;
        this.customerBusinessId = this.rowData.customerBusinessId;
        this.ownerCode = this.rowData.ownerCode;
    },
    createTableColumns() {
      return [
        {
          title: '序号',
          dataIndex: 'index',
          width: 80,
          sorter: true,
          render: props => {
            return <span>{props.row.index + 1}</span>;
          }
        },
        {
          title: '创建时间',
          dataIndex: 'createdAt',
          minWidth: 150,
          filterType: 'input',
          render: props =>{
            return <span>{ formatDates(props.row.createdAt) } </span>
          }
        },
        {
          title: '客户名称',
          dataIndex: 'customerName',
          filterType: 'input'
        },
        {
          title: '客户类型',
          dataIndex: 'customerType',
          filterType: 'checkbox',
          filterItems: this.createDictList('1523'),
          render: props => {
            return <span>{this.createDictText(props.row.customerType, '1523')}</span>;
          }
        },
        {
          title: '联系人姓名',
          dataIndex: 'contactName',
          filterType: 'input'
        },
        {
          title: '性别',
          dataIndex: 'gender',
          filterType: 'checkbox',
          filterItems: this.createDictList('1002'),
          render: props => {
            return <span>{this.createDictText(props.row.gender, '1002')}</span>;
          }
        },
        {
          title: '手机号码',
          dataIndex: 'mobilePhone',
          filterType: 'input'
        },
        {
          title: '线索状态',
          dataIndex: 'clueStatus',
          filterType: 'checkbox',
          filterItems: this.createDictList('7000'),
          render: props => {
            return <span>{this.createDictText(props.row.clueStatus, '7000')}</span>;
          }
        },
        {
          title: '来源大类',
          dataIndex: 'clueSourceNameBig',
          filterType: 'input',
        },
        {
          title: '来源细分',
          dataIndex: 'clueSourceNameSmall',
          filterType: 'input',
        },
        {
          title: '意向品牌',
          dataIndex: 'inteBrandName',
          filterType: 'input'
        },
        {
          title: '意向车系',
          dataIndex: 'inteCarSeriesName',
          filterType: 'input'
        },
        {
          title: '意向车型',
          dataIndex: 'inteCarTypeName',
          filterType: 'input'
        },
        {
          title: '线索热度',
          dataIndex: 'temperature',
          filterType: 'checkbox',
          filterItems: this.createDictList('7018'),
          render: props => {
            return <span>{this.createDictText(props.row.temperature, '7018')}</span>;
          }
        },
      ];
    },
    async getAboutCluesList() {
      const res = await queryAboutClues(this.mobilePhone, this.customerBusinessId, this.ownerCode)
      // const res = await queryAboutClues(13214145414)
      console.log('相关线索', res)
      if (res.resultCode === 200) {
        this.cluesList = res.data;
      }
    },

  }
};
</script>

<style lang="less" scoped>
.information{
  position: relative;
  .info{
    position: absolute;
    top: -10px;
    left: 13px;
  }
  .line{
    width: 6px;
    height: 20px;
    background: #1890FF;
    position: absolute;
    top: -10px;
    left: 0;
  }
  .el-divider--horizontal {
    display: block;
    height: 1px;
    width: 90.5%;
    margin: 20px 0 12px 92px;
}
}
</style>

